import React from 'react';
import { useSelector } from 'react-redux'
import { Statistic } from 'antd'
import Echarts from '../../../components/Echarts';
import Statis from '../../../components/Statis';
import Timeline from '../../../components/Timeline';
import './home.scss'

interface Props {}

function Home(props:Props) {

    var userInfo = useSelector((state:any)=>state.userInfo)

    const { Countdown } = Statistic;
    const deadline = Date.now() + 1080 * 60 * 60 * 24 * 1 + 1000 * 30;

    return (
        <div className='home'>
            <div className="one">
                <div className="image">
                    <img src='http://hd.wallpaperswide.com/thumbs/winter_stillness-t1.jpg'/>
                </div>
                <div className="admin">
                    当前登录的管理员为 : &nbsp;
                    <p>{userInfo.adminname}</p>
                </div>
                <div className="login">
                    距离上次登录已经过去 : 
                    <Countdown value={deadline} format="D 天 H 时 m 分 s 秒" />
                </div>
            </div>
            <div className="two">
                <Echarts/>
                <p>后台管理数据南丁格尔图</p>
            </div>
            <div className="three">
                <Statis/>
                <p>周用户数据统计分析</p>
            </div>
            <div className="four">
                <Timeline/>
                <p>公司发展历程</p>
            </div>
        </div>
    );
}

export default Home;